import { ref } from 'vue'

const notifications = ref([])

export function useNotification() {
  const showNotification = (title, message, type = 'success', duration = 3000) => {
    const id = Date.now() + Math.random()
    const notification = {
      id,
      title,
      message,
      type,
      show: true
    }
    
    notifications.value.push(notification)
    
    // 自动关闭
    if (duration > 0) {
      setTimeout(() => {
        removeNotification(id)
      }, duration)
    }
    
    return id
  }
  
  const removeNotification = (id) => {
    const index = notifications.value.findIndex(n => n.id === id)
    if (index > -1) {
      notifications.value[index].show = false
      // 等待动画完成后移除
      setTimeout(() => {
        notifications.value.splice(index, 1)
      }, 300)
    }
  }
  
  const showSuccess = (title, message, duration) => {
    return showNotification(title, message, 'success', duration)
  }
  
  const showError = (title, message, duration) => {
    return showNotification(title, message, 'error', duration)
  }
  
  const showWarning = (title, message, duration) => {
    return showNotification(title, message, 'warning', duration)
  }
  
  const showInfo = (title, message, duration) => {
    return showNotification(title, message, 'info', duration)
  }
  
  return {
    notifications,
    showNotification,
    removeNotification,
    showSuccess,
    showError,
    showWarning,
    showInfo
  }
}
